<template>
  <view class="bgF2 global-wrapper">
    <view class="mch-header">
      <JHeaderTitle title="创建商户" bgColor="#f2f2f2" />
    </view>
    <JMainCard pd="0" wrapPd="15rpx 30rpx">
      <JInput
        name="商户全称"
        :isBorder="true"
        v-model:value="mchInfo.mchName"
        :rules="{ name: 'mchName', rule: 'REG_NotNUll' }"
        place="请输入商户全称"
      ></JInput>
      <JInput
        name="商户简称"
        v-model:value="mchInfo.mchShortName"
        :rules="{ name: 'mchShortName', rule: 'REG_NotNUll' }"
        place="请输入商户简称"
      ></JInput>
      <JInput
        name="商户登录名"
        v-model:value="mchInfo.loginUsername"
        :rules="{ name: 'loginUsername', rule: 'REG_LoginName' }"
        place="字母开头6到18位"
      ></JInput>
    </JMainCard>
    <JMainCard pd="0" wrapPd="15rpx 30rpx">
      <JInput
        name="联系人姓名"
        :isBorder="true"
        v-model:value="mchInfo.contactName"
        :rules="{ name: 'contactName', rule: 'REG_NotNUll' }"
        place="请输入联系人姓名"
      ></JInput>
      <JInput
        name="联系人手机号"
        v-model:value="mchInfo.contactTel"
        :rules="{ name: 'contactTel', rule: 'REG_Phone' }"
        place="请输入联系人手机号"
      ></JInput>
      <JInput name="联系人邮箱" v-model:value="mchInfo.contactEmail" place="请输入联系人邮箱"></JInput>
    </JMainCard>
    <JMainCard pd="0" wrapPd="15rpx 30rpx">
      <JInput name="是否发送开通提醒" :isBorder="true">
        <switch
          :checked="mchInfo.isNotify == 1 ? true : false"
          style="margin-left: 20rpx; transform: scale(1.2)"
          color="#7737fe"
          @change="switchState($event, 'isNotify')"
        />
      </JInput>
      <JInput name="是否使用默认密码">
        <switch
          :checked="mchInfo.defaultPass == 1 ? true : false"
          style="margin-left: 20rpx; transform: scale(1.2)"
          color="#7737fe"
          @change="switchState($event, 'defaultPass')"
        />
      </JInput>
      <JInput
        name="自定义密码"
        v-model:value="mchInfo.loginPassword"
        :rules="{ name: 'loginPassword', rule: 'REG_NotNUll' }"
        place="请输入自定义密码"
        v-if="!mchInfo.defaultPass"
      ></JInput>
    </JMainCard>
    <JMainCard pd="0" wrapPd="15rpx 30rpx">
      <JInput name="备注" v-model:value="mchInfo.remark" place="请输入备注"></JInput>
    </JMainCard>
    <JButton pd="15rpx 30rpx 50rpx 30rpx" bottom="50rpx" @HandleTouch="createMch">创建商户</JButton>
  </view>
</template>

<script setup>
import { ref, reactive } from "vue"
import { $addMer, $getPasswordRules } from "@/http/apiManager.js"
import { onLoad } from "@dcloudio/uni-app"
import JHeaderTitle from "@/components/newComponents/JHeaderTitle/JHeaderTitle"
import JMainCard from "@/components/newComponents/JMainCard/JMainCard"
import JInput from "@/components/newComponents/JInput/JInput"
import JButton from "@/components/newComponents/JButton/JButton"
import { validateArray } from "@/hooks/rules"
import valid from "@/hooks/validate"
onLoad(() => {
  getRules()
})
const mchInfo = reactive({
  defaultPass: 1,
  isNotify: 0,
  state: 1,
})
const switchState = (e, v) => {
  mchInfo[v] = e.detail.value ? 1 : 0
}
const rules = ref({})
const getRules = () => {
  $getPasswordRules().then((res) => {
    rules.value.rule = new RegExp(res.bizData.regexpRules)
    rules.value.ruleText = res.bizData.errTips
  })
}
const createMch = () => {
  if (!!mchInfo.contactEmail) {
    if (!valid.REG_Email(mchInfo.contactEmail)) return uni.showToast({ title: "邮箱格式不正确", icon: "none" })
  }
  if (validateArray(mchInfo)) {
    if (mchInfo.loginPassword && !rules.value.rule.test(mchInfo.passwordType)) {
      return uni.showToast({
        title: rules.value.ruleText,
        icon: "none",
      })
    }
    $addMer(mchInfo).then((res) => {
      if (res.code === 0) {
        uni.showToast({
          icon: "success",
          title: "添加成功",
        })
        uni.navigateBack()
      }
    })
  }
}
</script>
